<div nz-row [nzGutter]="[16, 16]">
  @for (item of 8 | numberLoop; track $index) {
    <div nz-col [nzLg]="12" [nzMd]="12" [nzSm]="24" [nzXl]="12" [nzXs]="24" [nzXXl]="12">
      <nz-card nzHoverable [nzCover]="coverTemplate">
        <nz-card-meta nzDescription="希望是一个好东西，也许是最好的，好东西是不会消亡的" [nzTitle]="'Alipay'"></nz-card-meta>
        <div class="card-item-content">
          <span nz-typography nzType="secondary">1小时前</span>
          <nz-avatar-group>
            <nz-avatar nzIcon="user" nzSrc="//zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"></nz-avatar>
            <nz-avatar nzText="U" style="background-color: #f56a00"></nz-avatar>
            <nz-avatar nz-tooltip nzIcon="user" nzTooltipTitle="NG-ZORRO User" style="background-color: #87d068"></nz-avatar>
            <nz-avatar nzText="NG" style="background-color: #1890ff"></nz-avatar>
          </nz-avatar-group>
        </div>
      </nz-card>
    </div>
  }
</div>
<ng-template #coverTemplate>
  <img alt="example" src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png" />
</ng-template>
